<!--
 * @LastEditors: caiwenqi
 * @EditorsDescripttion: 风测及认证页面
 * @LastEditTime: 2020-08-13 15:38:00
-->
<template>
    <div>
        <page-title :title="ruleTitle" :backUrl="backUrl"></page-title>
        <div class="riskAuthenticationWrap">
            <div class="listTitle"><div class="leftPoint"></div><div class="titleName">风险测评</div></div>
            <ul class="listWrap">
                <li>
                    <div class="leftWrap">私募风险测评</div>
                    <div class="rightWrap">
                        <div class="content" v-if="data.endurePriStr!=null">
                            <p :class="data.endurePriStr != 6 ? 'effective':'overdue'">
                                {{riskResult(data.endurePriStr)}}
                            </p>
                            <p :class="data.endurePriStr != 6 ?'effectiveColor':'overdueColor'"
                            v-if="data.endureValiddate"
                            v-text="data.endurePriStr != 6 ? data.endureValiddate.slice(0,10) + ' 前有效': data.endureValiddate.slice(0,10) + ' 已过期'"></p>
                        </div>
                        <div class="content notCertified" v-else>
                            未测评                            
                        </div>
                    </div>
                </li>
                <li>
                    <div class="leftWrap">jjs风险测评</div>
                    <div class="rightWrap">
                        <div class="content" v-if="data.jjsToleranceStr!=null">
                            <p :class="data.jjsToleranceStr !=6 ?'effective':'overdue'">
                                {{riskResult(data.jjsToleranceStr)}}
                            </p>
                            <p :class="data.jjsToleranceStr !=6 ?'effectiveColor':'overdueColor'"
                            v-if="data.jjsValiddate"
                            v-text="data.jjsToleranceStr != 6 ? data.jjsValiddate.slice(0,10) + ' 前有效': data.jjsValiddate.slice(0,10) + ' 已过期'"></p>
                        </div>
                        <div class="content notCertified" v-else>
                            未测评                            
                        </div>
                    </div>
                </li>
                <li>
                    <div class="leftWrap">专项风险测评（期货风测）</div>
                    <div class="rightWrap">
                        <div class="content" v-if="data.futuresToleranceStr!=null">
                            <p :class="data.futuresToleranceStr != 6 ?'effective':'overdue'">
                                {{riskResult(data.futuresToleranceStr)}}
                            </p>
                            <p :class="data.futuresToleranceStr != 6 ?'effectiveColor':'overdueColor'"
                            v-if="data.futuresValiddate"
                            v-text="data.futuresToleranceStr != 6 ? data.futuresValiddate.slice(0,10) + ' 前有效': data.futuresValiddate.slice(0,10) + ' 已过期'"></p>
                        </div>
                        <div class="content notCertified" v-else>
                            未测评                            
                        </div>
                    </div>
                </li>
            </ul>
            <div class="listTitle"><div class="leftPoint"></div><div class="titleName">合格投资者&投资者认证</div></div>
            <ul class="listWrap">
                <li>
                    <div class="leftWrap">合格投资者</div>
                    <div class="rightWrap">
                        <div class="content" v-if="data.accreditedInvestor!=null">
                            <p :class="data.accreditedInvestor!=2?'effective':'overdue'">
                                {{changeType(data.accreditedInvestor)}}
                            </p>
                            <p :class="data.accreditedInvestor==2?'overdueColor':'effectiveColor'"
                            v-if="data.accreditedInvestorValiddate"
                            v-text="data.accreditedInvestor != 2 ? data.accreditedInvestorValiddate.slice(0,10) + ' 前有效': data.accreditedInvestorValiddate.slice(0,10) + ' 已过期'"></p>
                        </div>                
                        <div class="content notCertified" v-else>
                            未认证
                        </div>
                    </div>
                </li>
                <li>
                    <div class="leftWrap">合格投资者类型</div>
                    <div class="rightWrap">
                        <div class="content" v-if="data.accreditedInvestorType!=null">
                            <p :class="data.accreditedInvestorType?'effective':'overdue'">{{data.accreditedInvestorType==1?'资管合格投资者':'私募合格投资者'}}</p>
                        </div>                
                        <div class="content notCertified" v-else>
                            未认证
                        </div>
                    </div>
                </li>
                <li>
                    <div class="leftWrap">投资者分类</div>
                    <div class="rightWrap">
                        <div class="content" v-if="data.investFavour!=null">
                            <p :class="data.investFavour?'effective':'overdue'">
                                {{investorType(data.investFavour)}}
                            </p>
                            <p :class="data.investFavour != 2 ?'effectiveColor':'overdueColor'"
                            v-if="data.investFavourValiddate"
                            v-text="data.investFavour !=2 ? data.investFavourValiddate.slice(0,10) +' 前有效': data.investFavourValiddate.slice(0,10)+' 已过期'"></p>
                        </div>                
                        <div class="content notCertified" v-else>
                            未认证
                        </div>
                    </div>
                </li>
                <li>
                    <div class="leftWrap">专业认证类型</div>
                    <div class="rightWrap">
                        <div class="content" v-if="data.investFavourType!=null">
                            <p :class="data.investFavourType ?'effective':'overdue'">{{data.investFavourType==1?'资管专业投资者':'私募专业投资者'}}</p>
                            <!-- <p :class="data.timerTemp ?'effectiveColor':'overdueColor'"
                            v-text="data.timerTemp?data.investFavourValiddate+' 前有效':data.investFavourValiddate+' 已过期'">{{data.investFavourValiddate}}</p> -->
                        </div>                
                        <div class="content notCertified" v-else>
                            未认证
                        </div>
                    </div>
                </li>
                <li>
                    <div class="leftWrap">jjs合格投资者</div>
                    <div class="rightWrap">
                        <div class="content" v-if="data.accreditedInvestorJJS!=null">
                            <p class="media_font_adaptation_14px" :class="data.accreditedInvestorJJS?'effective':'overdue '">{{changeType(data.accreditedInvestorJJS)}}</p>
                            <p :class="data.accreditedInvestorJJS!=2?'effectiveColor':'overdueColor'"
                            v-if="data.accreditedInvestorJJSValiddate"
                            v-text="data.accreditedInvestorJJS!=2 ? data.accreditedInvestorJJSValiddate.slice(0,10)+' 前有效': data.accreditedInvestorJJSValiddate.slice(0,10)+' 已过期'"></p>
                        </div>                
                        <div class="content notCertified" v-else>
                            未认证
                        </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</template>

<script  type="text/javascript">
    import pageTitle from '@src/common/pageTitle/pageTitle';
    export default {
        name: "riskAuthentication",
        components: {pageTitle},
        data(){
            return {
                ruleTitle: '风测及认证',
                backUrl: '', //传给pageTitle组件，返回上一页的标识
                data:{},
                customerId: null,
            };
        },
        created() {
            // this.cstatus = 5
            let deUrl = decodeURI(window.location.href);
            // 客户编号
            if (splitUrl(deUrl)['customerId'] == '--') {
                this.customerId = null;
            } else {
                this.customerId = splitUrl(deUrl)['customerId']
            }
            // this.customerId = this.$route.query.customerId;
            this.getData()
        },
        mounted(){
            
        },
        methods: {
            getData(){
                console.log(this.customerId,'this.customerId')
                this.$axiosHttp.http({
                    url: apiUrl.getRiskAuthentication,
                    needFailCallback: true,
                    method: 'POST',
                    params: {
                        customerNo:this.customerId,
                    },
                }, (res) => {
                    this.data = res.data.data;
                    // this.data = data;
                    console.log(data,'<===data');
                },
                // res => {
                //     if(res.data.status == "1000") {
                //         this.showLoading = true;
                //         // tipAction(res.data.message);
                //     } else {
                //         // tipAction(res.data.message);
                //     }
                // }
                );
            },
            //合格投资者 jjs合格投资者转字典值
            changeType(code){
                var result;
                switch(code){
                    case 0:
                        result = '未认证';//未通过
                        break;
                    case 1:
                        result = '合格';//已通过
                        break;
                    case 2:
                        result = '已过期';//已过期
                        break;
                }
                return result;   
            },
            //私募 jjs 专项风测结果转字典值
            riskResult(riskType){
                var result;
                switch(riskType){
                    case '1':
                        result = '保守型';
                        break;
                    case '2':
                        result = '稳健型';
                        break;
                    case '3':
                        result = '平衡型';
                        break;
                    case '4':
                        result = '成长型';
                        break;
                    case '5':
                        result = '进取型';
                        break;
                    case '6':
                        result = '已过期';
                        break;
                }
                return result;   
            },
            //投资者分类字典值转换
            investorType(type){
                var result;
                switch(type){
                    case '0':
                        result = '普通投资者';
                        break;
                    case '1':
                        result = '专业投资者';
                        break;
                    case '2':
                        result = '已过期';
                        break;
                }
                return result;   
            }
        }
    }
</script>

<style>
    .riskAuthenticationWrap{
        /*background: #fff;*/
        width: 100%;
    }
    .riskAuthenticationWrap .listTitle{
        display: flex;
        align-items: center;
        height: 2.35rem;
    }
    .riskAuthenticationWrap .listTitle .titleName{
        display: inline-block;
        color: #545861;
        margin-left: .25rem;
        font-size: .75rem;
        font-weight: 500;
    }
    .riskAuthenticationWrap .listTitle .leftPoint{
        display: inline-block;
        background: #FF6500;
        border-radius: 1rem;
        width: 0.2rem;
        height: 0.6rem;
        margin-left: .75rem;
    }
    .riskAuthenticationWrap .listWrap{
        width: 100%;
        background: #fff;
    }
    .riskAuthenticationWrap .listWrap>li{
        margin: 0 auto;
        padding: 0 .75rem;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 3rem;
        border-bottom: solid .0125rem #f2f3f5;
    }
    .riskAuthenticationWrap .listWrap>li:last-of-type{
        border-bottom: none;
    }
    .riskAuthenticationWrap .listWrap .leftWrap{
        color: #1D212B;;
        font-size: .75rem;
        font-weight: 500;
    }
    .riskAuthenticationWrap .listWrap .rightWrap .content{
        text-align: right;
    }
    .riskAuthenticationWrap .content .effective{
        color: #A88F7A;
        font-size: .7rem;     
        font-weight: 500;
    }
    .riskAuthenticationWrap .content .overdue{
        color: #91959E;
        font-size: .7rem;     
        font-weight: 500;
    }
    .riskAuthenticationWrap .content .effectiveColor{
        color: #91959E;
        font-size: .5rem;   
        font-weight: 500;  
    }
    .riskAuthenticationWrap .content .overdueColor{
        color: #E84A55;
        font-size: .5rem;     
        font-weight: 500;
    }
    .riskAuthenticationWrap .notCertified{
        color: #91959E;
        font-size: .7rem;
        font-weight: 500;
    }
</style>